<template>
    <div class="add-logistics">
        <template v-if="value.type == 1">
            <el-form-item label="物流支持" required>
                <el-checkbox v-model="value.is_express" :false-label="0" :true-label="1"
                    >快递发货</el-checkbox
                >
                <el-checkbox v-model="value.is_selffetch" :false-label="0" :true-label="1"
                    >上门自提</el-checkbox
                >
            </el-form-item>
            <el-form-item label="运费设置" required>
                <el-radio-group v-model="value.express_type">
                    <el-radio :label="1">包邮</el-radio>
                    <el-radio :label="2">统一运费</el-radio>
                    <el-radio :label="3">运费模板</el-radio>
                </el-radio-group>
            </el-form-item>
            <el-form-item v-if="value.express_type == 2" prop="express_money">
                <el-input v-model="value.express_money">
                    <template slot="append">元</template>
                </el-input>
            </el-form-item>
            <el-form-item v-if="value.express_type == 3">
                <el-select
                    v-model="value.express_template_id"
                    placeholder="请选择运费模板"
                    prop="express_template_id"
                >
                    <el-option
                        v-for="item in freightList"
                        :key="item.id"
                        :label="item.name"
                        :value="item.id"
                    ></el-option>
                </el-select>
            </el-form-item>
        </template>
        <template v-else-if="value.type == 2">
            <el-form-item label="配送方式" required>
                <el-checkbox v-model="value.is_virtualdelivery" :false-label="0" :true-label="1"
                    >虚拟发货</el-checkbox
                >
            </el-form-item>
            <el-form-item label="买家付款后" required>
                <el-radio-group v-model="value.after_pay">
                    <el-radio :label="1">自动发货</el-radio>
                    <el-radio :label="2">手动发货</el-radio>
                </el-radio-group>
            </el-form-item>
            <el-form-item label="发货后" required>
                <el-radio-group v-model="value.after_delivery">
                    <el-radio :label="1">自动完成订单</el-radio>
                    <el-radio :label="2">需要买家确认收货</el-radio>
                </el-radio-group>
            </el-form-item>
            <el-form-item label="发货内容" required prop="delivery_content">
                <el-input
                    v-model="value.delivery_content"
                    type="textarea"
                    style="width: 460px"
                    rows="8"
                    show-word-limit
                    placeholder="请输入发货内容"
                    @change="handleChange"
                ></el-input>
            </el-form-item>
        </template>
    </div>
</template>

<script lang="ts">
import { Component, Prop, Vue } from 'vue-property-decorator'

@Component
export default class AddLogistics extends Vue {
    @Prop() value: any
    @Prop({ default: () => ({}) }) lists: any
    get freightList() {
        return this.lists.freight_list || []
    }

    handleChange(val: string) {
        this.value.delivery_content = val.trim()
    }
}
</script>
